<template>
	<view>
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<u--form
				labelPosition="left"
				:model="model1"
		>
			<u-form-item
					label="标题"
					borderBottom
			>
				<u--input
						v-model="model1.userInfo.name"
						border="none"
				></u--input>
			</u-form-item>
			<u-form-item
					label="类别"
					borderBottom
					@click="showType = true;"
			>
				<u--input
						v-model="model1.userInfo.type"
						disabled
						disabledColor="#ffffff"
						placeholder="请选择类别"
						border="none"
				></u--input>
				<u-icon
						slot="right"
						name="arrow-right"
				></u-icon>
			</u-form-item>
			
			<u-form-item
					label="活动内容"
					borderBottom
			>
			<u--textarea v-model="model1.userInfo.content" placeholder="请输入内容" ></u--textarea>
			</u-form-item>
			<u-form-item
					label="添加图片"
					borderBottom
					@click="upload"
			>
			<image v-for="(item) in imgArr" :src="item" style="width: 250rpx;" mode="widthFix" @click="view(item)"></image>
			</u-form-item>
		</u--form>
		<u-action-sheet
				:show="showType"
				:actions="types"
				title="请选择类别"
				description="如果选择保密会报错"
				@close="showType = false"
				@select="typeSelect"
		>
		</u-action-sheet>
		<button @click="publish">发布</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			imgArr:[],
			showType: false,
			model1: {
				userInfo: {
					name: '',
					content:"",
					type: '',
					img:'',
					uid:uni.getStorageSync("uid"),
				},
			},
			types: [
				{
					name: '娱乐',
				},
				{
					name: '生活',
				},
				{
					name: '保密',
				},
			]
		};
	},
	methods: {
		typeSelect(e) {
			this.model1.userInfo.type = e.name
		},
		upload(){
			uni.chooseImage({
				count:3,
				//使用箭头函数，保证this对象被识别
				success:(res) => {
					const tempFilePaths = res.tempFilePaths;
					const uploadTask = uni.uploadFile({
						url: 'http://localhost:1818/img/uploadImg/',
						filePath: tempFilePaths[0],
						name: 'image',
						success:(uploadRes) => {
							let res = JSON.parse(uploadRes.data);
							console.log(res.data);
							this.imgArr = [...this.imgArr, res.data]
						}
					});
				}
			})
		},
		publish(){
			console.log("发布活动",this.model1.userInfo);
			this.model1.userInfo.img = this.imgArr[0];
			uni.request({
				url:"http://localhost:6061/activity/add",
				method:"PUT",
				header:{
					'Authorization':uni.getStorageSync("token"),
					'content-Type':'application/json'
				},
				data:this.model1.userInfo,
				success:(res) => {
					console.log(res.data.data);
					uni.showToast({
						title:"发布成功",
						success() {
							uni.switchTab({
								url:"active"
							})
						}
					})
				}
			})
		}
	},
};
</script>